<!doctype html>
<html lang="en">
  <head>

    <link rel="stylesheet" id="skins-switcher" href="css/style.css" type="text/css" media="screen"/>
    <link rel="stylesheet" href="css/prettyPhoto.css" type="text/css" media="screen"/>

    <!--JS FILES STARTS-->
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="js/custom.js"></script>
    <script type="text/javascript" src="js/slides/slides.min.jquery.js"></script>
    <script type="text/javascript" src="js/cycle-slider/cycle.js"></script>
    <script type="text/javascript" src="js/nivo-slider/jquery.nivo.slider.js"></script>
    <script type="text/javascript" src="js/tabify/jquery.tabify.js"></script>
    <script type="text/javascript" src="js/prettyPhoto/jquery.prettyPhoto.js"></script>
    <script type="text/javascript" src="js/twitter/jquery.tweet.js"></script>
    <script type="text/javascript" src="js/scrolltop/scrolltopcontrol.js"></script>
    <script type="text/javascript" src="js/portfolio/filterable.js"></script>
    <script type="text/javascript" src="js/modernizr/modernizr-2.0.3.js"></script>
    <script type="text/javascript" src="js/easing/jquery.easing.1.3.js"></script>
    <script type="text/javascript" src="js/kwicks/jquery.kwicks-1.5.1.pack.js"></script>
    <script type="text/javascript" src="js/swfobject/swfobject.js"></script>
    <script type="text/javascript" src="js/vticker/jquery.vticker.1.4.js"></script>
    <script type="text/javascript" src="js/uploadify/jquery.uploadify.v2.1.4.min.js"></script>


  </head>
  <body>
    <div class="one">

      <ul id="socialmenu" class="socialmenu">
        <li class="active"><a href="#updates_tab">Updates</a></li>
        <li><a href="#wall_tab">Wall</a></li>
        <li><a href="#friends_tab">Friends</a></li>
        <li><a href="#photographs_tab">Photographs</a></li>
        <li><a href="#video_tab">Video</a></li>
        <li><a href="#music_tab">Music</a></li>
      </ul>

      <!-- updates tab-->
      <div id="updates_tab" class="socialcontent">

          <div class="social-left-content">
            
          <div class="horizontal-line-small-margin"></div>
            <div style="float:left;background-color: #fff">
            <h4>Social Updates</h4>
            </div>

            
            <p>				
              <img src="images/profile/suhail_large.jpg" alt=" " width="200" height="145" class=" portfolio-img pretty-box"/>		
            </p>
            <h4>Suhail Manzoor</h4>
            <h4><span class="colored">Mojo : 300</span></h4>

            <div class="horizontal-line-small-margin"></div>
            <h4>My Network Tags</h4>

            <div class="social-left-content-inner">

              <fieldset style="float: left">
                <input class="tag-input" type="text" onblur="if(this.value=='')this.value='Add a tag';" onfocus="if(this.value=='Add a tag')this.value='';" value="Add a tag"/>
              </fieldset>

              <div class="sidebar-tag-item"><a href="#">Media</a></div>
              <div class="sidebar-tag-item"><a href="#">Music</a></div>
              <div class="sidebar-tag-item"><a href="#">Photography</a></div>
              <div class="sidebar-tag-item"><a href="#">Video</a></div>
              <div class="sidebar-tag-item"><a href="#">Clip</a></div>
              <div class="sidebar-tag-item"><a href="#">Blog</a></div>
              <div class="sidebar-tag-item"><a href="#">Portfolio</a></div>
              <div class="sidebar-tag-item"><a href="#">Tag</a></div>
              <div class="sidebar-tag-item"><a href="#">Sound</a></div>
              <div class="sidebar-tag-item"><a href="#">Movie</a></div>
            </div>

            <div class="spacer-20"></div>

            <div class="horizontal-line-small-margin"></div>
            <h4>My Apps</h4>

            Sky News<br/>
            TripAdvisor<br/>
            Mujjio Developer<br/>
            Questions<br/>
            Scrabble

            <div class="horizontal-line-small-margin"></div>

          </div>

          <div class="social-right-content">
            
            <div class="horizontal-line-small-margin"></div>
            <div id="social-updates-add-menu" style="float:left;background-color: #fff">
              <a href="#" id="link-social-add-comment" class="comment" title="Add Comment" class="active">&nbsp;</a>
              <a href="#" id="link-social-add-photo" class="photo" title="Add Photo">&nbsp;</a>
              <a href="#" id="link-social-add-video" class="video" title="Add Video">&nbsp;</a>
              <a href="#" id="link-social-add-music" class="music" title="Add Music">&nbsp;</a>
              <a href="#" id="link-social-add-link" class="link" title="Add Link">&nbsp;</a>
            </div>

            <div id="social-content-add-container">

              <blockquote class="comment">
                <div class="comment">
                  <img src="images/profile/suhail.jpg" alt=" " width="60" height="60" class="img-align-left"/>
                  <a href="#">Suhail Manzoor</a>
                  <p style="margin-top: -9px">
                  <fieldset style="float: left">
                    <input id="social-comment-input" class="comment-input" type="text" onblur="if(this.value=='')this.value='Add a news update';" onfocus="if(this.value=='Add a news update')this.value='';" value="Add a news update"/>
                  </fieldset>
                  </p>
                </div>
              </blockquote>
            </div>

            <div id="social-comment-add-container" style="display: none"></div>

            
            <!--blockquote class="photo">
              <div class="photo">
                <img src="images/profile/suhail.jpg" alt=" " width="60" height="60" class="img-align-left"/>

                <h6>Add a new Photograph</h6>
                <div class="link-file" style="width:140px; margin-left: 60px; float:left"><a href="#">Choose file</a></div>
                <div class="link-computer" style="width:140px; margin-left: 10px; float:left"><a href="#">Take from webcam</a></div> 
                <input type="file" id="file_upload" name="file_upload" />
                <a href="javascript:jQuery('#file_upload').uploadifyUpload();">Upload Files</a>

              </div>
            </blockquote-->

            <blockquote class="photo">
              <div class="photo">
                <img src="images/profile/suhail.jpg" alt=" " width="60" height="60" class="img-align-left"/>
                <div class="social-add-photo-container">
                  <a href="images/gallery/grid-img-003.jpg" class="portfolio-item-preview" title="Indescretion" data-rel="prettyPhoto"><img src="images/gallery/grid-img-003.jpg" alt=" " width="210" height="145" class="portfolio-img pretty-box"/></a>
                </div>
                <a href="#">Suhail Manzoor</a> Added a Photograph<div style="float: right">1 minute ago</div>
                <p>
                  Just taken with my new Nikon D7000. Enjoy!
                </p>
                <p>
                <div class="link-more-info" style="width:270px"><a href="#">More info...</a></div>
                <div class="link-buy" style="width:270px"><a href="#">Buy</a></div>
                <div class="link-bid" style="width:270px"><a href="#">Bid</a></div>                
                </p>              
              </div>
            </blockquote>

            <blockquote>
              <div class="comment">
                <img src="images/profile/muttley.jpg" alt=" " width="60" height="60" class="img-align-left"/>
                <a href="#">Muttley</a> Added a Comment<div style="float: right">1 minute ago</div>
                <p>
									Hey dude, I reckon we should add a main picture to your profile.<a href="#"> Click here</a> and let's do it.
                </p>
              </div>
            </blockquote>

            <blockquote class="comment">
              <div class="comment">
                <img src="images/profile/friend1.jpg" alt=" " width="60" height="60" class="img-align-left"/>
                <a href="#">Balacz Barnucs</a> Added a Comment<div style="float: right">2 minutes ago</div>
                <p>
									32ft of teak below my feet, here comes happy sailing.
                </p>
              </div>
            </blockquote>
            <blockquote class="comment">
              <div class="comment">
                <img src="images/profile/friend2.jpg" alt=" " width="60" height="60" class="img-align-left"/>
                <a href="#">Balacz Barnucs</a> Added a Comment<div style="float: right">2 minutes ago</div>
                <p>
									32ft of teak below my feet, here comes happy sailing.
                </p>
              </div>
            </blockquote>
            <blockquote class="comment">
              <div class="comment">
                <img src="images/profile/friend3.jpg" alt=" " width="60" height="60" class="img-align-left"/>
                <a href="#">Balacz Barnucs</a> Added a Comment<div style="float: right">2 minutes ago</div>
                <p>
									32ft of teak below my feet, here comes happy sailing.
                </p>
              </div>
            </blockquote>
            <blockquote class="comment">
              <div class="comment">
                <img src="images/profile/friend4.jpg" alt=" " width="60" height="60" class="img-align-left"/>
                <a href="#">Balacz Barnucs</a> Added a Comment<div style="float: right">2 minutes ago</div>
                <p>
									32ft of teak below my feet, here comes happy sailing.
                </p>
              </div>
            </blockquote>
            <blockquote class="comment">
              <div class="comment">
                <img src="images/profile/friend5.jpg" alt=" " width="60" height="60" class="img-align-left"/>
                <a href="#">Balacz Barnucs</a> Added a Comment<div style="float: right">2 minutes ago</div>
                <p>
									32ft of teak below my feet, here comes happy sailing.
                </p>
              </div>
            </blockquote>
            <blockquote class="comment">
              <div class="comment">
                <img src="images/profile/friend6.jpg" alt=" " width="60" height="60" class="img-align-left"/>
                <a href="#">Balacz Barnucs</a> Added a Comment<div style="float: right">2 minutes ago</div>
                <p>
									32ft of teak below my feet, here comes happy sailing.
                </p>
              </div>
            </blockquote>
            <blockquote class="comment">
              <div class="comment">
                <img src="images/profile/friend7.jpg" alt=" " width="60" height="60" class="img-align-left"/>
                <a href="#">Balacz Barnucs</a> Added a Comment<div style="float: right">2 minutes ago</div>
                <p>
									32ft of teak below my feet, here comes happy sailing.
                </p>
              </div>
            </blockquote>
            <blockquote class="comment">
              <div class="comment">
                <img src="images/profile/friend8.jpg" alt=" " width="60" height="60" class="img-align-left"/>
                <a href="#">Balacz Barnucs</a> Added a Comment<div style="float: right">2 minutes ago</div>
                <p>
									32ft of teak below my feet, here comes happy sailing.
                </p>
              </div>
            </blockquote>
            <blockquote class="comment">
              <div class="comment">
                <img src="images/profile/friend9.jpg" alt=" " width="60" height="60" class="img-align-left"/>
                <a href="#">Balacz Barnucs</a> Added a Comment<div style="float: right">2 minutes ago</div>
                <p>
									32ft of teak below my feet, here comes happy sailing.
                </p>
              </div>
            </blockquote>
            <blockquote class="comment">
              <div class="comment">
                <img src="images/profile/friend10.jpg" alt=" " width="60" height="60" class="img-align-left"/>
                <a href="#">Balacz Barnucs</a> Added a Comment<div style="float: right">2 minutes ago</div>
                <p>
									32ft of teak below my feet, here comes happy sailing.
                </p>
              </div>
            </blockquote>

            <div class="spacer-20"></div>
            <!--a href="#">more updates</a-->
            <div class="spacer-20"></div>
          </div>

        </div>

      </div>
      <!--end updates tab-->

      <!-- wall tab-->
      <div id="wall_tab" class="socialcontent">
        
        
          <div class="social-left-content">
            
          <div class="horizontal-line-small-margin"></div>
            <div style="float:left;background-color: #fff">
            <h4>My Wall</h4>
            </div>

            
            <p>				
              <img src="images/profile/suhail_large.jpg" alt=" " width="200" height="145" class=" portfolio-img pretty-box"/>		
            </p>
            <h4>Suhail Manzoor</h4>
            <h4><span class="colored">Mojo : 300</span></h4>

            <div class="horizontal-line-small-margin"></div>
            <h4>My Network Tags</h4>

            <div class="social-left-content-inner">

              <fieldset style="float: left">
                <input class="tag-input" type="text" onblur="if(this.value=='')this.value='Add a tag';" onfocus="if(this.value=='Add a tag')this.value='';" value="Add a tag"/>
              </fieldset>

              <div class="sidebar-tag-item"><a href="#">Media</a></div>
              <div class="sidebar-tag-item"><a href="#">Music</a></div>
              <div class="sidebar-tag-item"><a href="#">Photography</a></div>
              <div class="sidebar-tag-item"><a href="#">Video</a></div>
              <div class="sidebar-tag-item"><a href="#">Clip</a></div>
              <div class="sidebar-tag-item"><a href="#">Blog</a></div>
              <div class="sidebar-tag-item"><a href="#">Portfolio</a></div>
              <div class="sidebar-tag-item"><a href="#">Tag</a></div>
              <div class="sidebar-tag-item"><a href="#">Sound</a></div>
              <div class="sidebar-tag-item"><a href="#">Movie</a></div>
            </div>

            <div class="spacer-20"></div>

            <div class="horizontal-line-small-margin"></div>
            <h4>My Apps</h4>

            Sky News<br/>
            TripAdvisor<br/>
            Mujjio Developer<br/>
            Questions<br/>
            Scrabble

            <div class="horizontal-line-small-margin"></div>

          </div>

          <div class="social-right-content">
            
            <div class="horizontal-line-small-margin"></div>
            <div id="social-updates-add-menu" style="float:left;background-color: #fff">
              <a href="#" id="link-social-add-comment" class="comment" title="Add Comment" class="active">&nbsp;</a>
              <a href="#" id="link-social-add-photo" class="photo" title="Add Photo">&nbsp;</a>
              <a href="#" id="link-social-add-video" class="video" title="Add Video">&nbsp;</a>
              <a href="#" id="link-social-add-music" class="music" title="Add Music">&nbsp;</a>
              <a href="#" id="link-social-add-link" class="link" title="Add Link">&nbsp;</a>
            </div>

            <div id="social-content-add-container">

              <blockquote class="comment">
                <div class="comment">
                  <img src="images/profile/suhail.jpg" alt=" " width="60" height="60" class="img-align-left"/>
                  <a href="#">Suhail Manzoor</a>
                  <p style="margin-top: -9px">
                  <fieldset style="float: left">
                    <input id="social-comment-input" class="comment-input" type="text" onblur="if(this.value=='')this.value='Add a news update';" onfocus="if(this.value=='Add a news update')this.value='';" value="Add a news update"/>
                  </fieldset>
                  </p>
                </div>
              </blockquote>
            </div>

            <div id="social-comment-add-container" style="display: none"></div>

            
            <!--blockquote class="photo">
              <div class="photo">
                <img src="images/profile/suhail.jpg" alt=" " width="60" height="60" class="img-align-left"/>

                <h6>Add a new Photograph</h6>
                <div class="link-file" style="width:140px; margin-left: 60px; float:left"><a href="#">Choose file</a></div>
                <div class="link-computer" style="width:140px; margin-left: 10px; float:left"><a href="#">Take from webcam</a></div> 
                <input type="file" id="file_upload" name="file_upload" />
                <a href="javascript:jQuery('#file_upload').uploadifyUpload();">Upload Files</a>

              </div>
            </blockquote-->

  
            <blockquote>
              <div class="comment">
                <img src="images/profile/muttley.jpg" alt=" " width="60" height="60" class="img-align-left"/>
                <a href="#">Muttley</a> Added a Comment<div style="float: right">1 minute ago</div>
                <p>
									Hey dude, I reckon we should add a main picture to your profile.<a href="#"> Click here</a> and let's do it.
                </p>
              </div>
            </blockquote>
            <blockquote>
              <div class="comment">
                <img src="images/profile/muttley.jpg" alt=" " width="60" height="60" class="img-align-left"/>
                <a href="#">Muttley</a> Added a Comment<div style="float: right">2 minute ago</div>
                <p>
									Do you know you can make money from Companies without buying anything.<a href="#"> Click here</a> to find out how.
                </p>
              </div>
            </blockquote>
           <blockquote class="photo">
              <div class="photo">
                <img src="images/profile/suhail.jpg" alt=" " width="60" height="60" class="img-align-left"/>
                <div class="social-add-photo-container">
                  <a href="images/gallery/grid-img-003.jpg" class="portfolio-item-preview" title="Indescretion" data-rel="prettyPhoto"><img src="images/gallery/grid-img-003.jpg" alt=" " width="210" height="145" class="portfolio-img pretty-box"/></a>
                </div>
                <a href="#">Suhail Manzoor</a> Added a Photograph<div style="float: right">1 minute ago</div>
                <p>
                  Just taken with my new Nikon D7000. Enjoy!
                </p>
                <p>
                <div class="link-more-info" style="width:270px"><a href="#">More info...</a></div>
                <div class="link-buy" style="width:270px"><a href="#">Buy</a></div>
                <div class="link-bid" style="width:270px"><a href="#">Bid</a></div>                
                </p>              
              </div>
           </blockquote>         
            <blockquote class="comment">
              <div class="comment">
                <img src="images/profile/friend6.jpg" alt=" " width="60" height="60" class="img-align-left"/>
                <a href="#">Balacz Barnucs</a> Added a Comment<div style="float: right">2 minutes ago</div>
                <p>
									32ft of teak below my feet, here comes happy sailing.
                </p>
              </div>
            </blockquote>
            <blockquote class="comment">
              <div class="comment">
                <img src="images/profile/friend7.jpg" alt=" " width="60" height="60" class="img-align-left"/>
                <a href="#">Balacz Barnucs</a> Added a Comment<div style="float: right">2 minutes ago</div>
                <p>
									32ft of teak below my feet, here comes happy sailing.
                </p>
              </div>
            </blockquote>
            <blockquote class="comment">
              <div class="comment">
                <img src="images/profile/friend8.jpg" alt=" " width="60" height="60" class="img-align-left"/>
                <a href="#">Balacz Barnucs</a> Added a Comment<div style="float: right">2 minutes ago</div>
                <p>
									32ft of teak below my feet, here comes happy sailing.
                </p>
              </div>
            </blockquote>
           

            <div class="spacer-20"></div>
            <!--a href="#">more updates</a-->
            <div class="spacer-20"></div>
          </div>

      </div>

      <!-- friends tab-->
      <div id="friends_tab" class="socialcontent">

        <div class="social-left-content">
          <div class="horizontal-line-small-margin"></div>
          <h4>Find a Friend</h4>

          <fieldset style="float: left">
            <input class="search-input" type="text" onblur="if(this.value=='')this.value='Enter Name';" onfocus="if(this.value=='Enter Name')this.value='';" value="Enter Name"/>
          </fieldset>
          <div class="spacer-20"></div>
          <div class="horizontal-line-small-margin"></div>

          <h4>You May Know</h4>


          <ul class="friend-picture-list">
            <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend1.jpg" border="0" alt=""/></a></li>
            <li class="friend-picture-list-name"><a href="#">Balacz Barnucz</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-online.gif" border="0" alt="" class="icon"/></a></li>
            <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend2.jpg" border="0" alt=""/></a></li>
            <li class="friend-picture-list-name"><a href="#">Friend Name</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-online.gif" border="0" alt="" class="icon"/></a></li>
            <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend3.jpg" border="0" alt=""/></a></li>
            <li class="friend-picture-list-name"><a href="#">Friend Name</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-online.gif" border="0" alt="" class="icon"/></a></li>
            <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend4.jpg" border="0" alt=""/></a></li>
            <li class="friend-picture-list-name"><a href="#">Friend Name</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-offline.gif" border="0" alt="" class="icon"/></a></li>
            <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend5.jpg" border="0" alt=""/></a></li>
            <li class="friend-picture-list-name"><a href="#">Friend Name</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-offline.gif" border="0" alt="" class="icon"/></a></li>
            <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend6.jpg" border="0" alt=""/></a></li>
            <li class="friend-picture-list-name"><a href="#">Friend Name</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-offline.gif" border="0" alt="" class="icon"/></a></li>
            <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend7.jpg" border="0" alt=""/></a></li>
            <li class="friend-picture-list-name"><a href="#">Friend Name</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-offline.gif" border="0" alt="" class="icon"/></a></li>
            <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend8.jpg" border="0" alt=""/></a></li>
            <li class="friend-picture-list-name"><a href="#">Friend Name</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-offline.gif" border="0" alt="" class="icon"/></a></li>
          </ul>

          <div class="horizontal-line-small-margin"></div>

        </div>

        <div class="social-right-content">
          <div class="horizontal-line-small-margin"></div>
          <div class="one-half-tab"><h4>My Friends</h4></div>

          <div class="one-half-tab">
            <a id="toggle-grid" href="#" title="grid"><img src="images/icons/icon-grid.jpg" border="0" alt="" style="padding-top:8px;margin-right:10px; float: right" /></a><a id="toggle-list" href="#" title="list"><img src="images/icons/icon-list.jpg" border="0" alt=""style="padding-top:8px;margin-right:10px; float: right"/></a>
          </div>      
          <div class="horizontal-line-small-margin"></div>

          <div id="friend-picture-list" class="view" style="display: none">

            <ul class="friend-picture-list">
              <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend1.jpg" border="0" alt=""/></a></li>
              <li class="friend-picture-list-name"><a href="#">Balacz Barnucz</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-online.gif" border="0" alt="" class="icon"/></a></li>
              <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend2.jpg" border="0" alt=""/></a></li>
              <li class="friend-picture-list-name"><a href="#">Friend Name</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-online.gif" border="0" alt="" class="icon"/></a></li>
              <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend3.jpg" border="0" alt=""/></a></li>
              <li class="friend-picture-list-name"><a href="#">Friend Name</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-online.gif" border="0" alt="" class="icon"/></a></li>
              <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend4.jpg" border="0" alt=""/></a></li>
              <li class="friend-picture-list-name"><a href="#">Friend Name</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-offline.gif" border="0" alt="" class="icon"/></a></li>
              <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend5.jpg" border="0" alt=""/></a></li>
              <li class="friend-picture-list-name"><a href="#">Friend Name</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-offline.gif" border="0" alt="" class="icon"/></a></li>
              <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend6.jpg" border="0" alt=""/></a></li>
              <li class="friend-picture-list-name"><a href="#">Friend Name</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-offline.gif" border="0" alt="" class="icon"/></a></li>
              <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend7.jpg" border="0" alt=""/></a></li>
              <li class="friend-picture-list-name"><a href="#">Friend Name</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-offline.gif" border="0" alt="" class="icon"/></a></li>
              <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend8.jpg" border="0" alt=""/></a></li>
              <li class="friend-picture-list-name"><a href="#">Friend Name</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-offline.gif" border="0" alt="" class="icon"/></a></li>
              <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend9.jpg" border="0" alt=""/></a></li>
              <li class="friend-picture-list-name"><a href="#">Friend Name</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-offline.gif" border="0" alt="" class="icon"/></a></li>
              <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend10.jpg" border="0" alt=""/></a></li>
              <li class="friend-picture-list-name"><a href="#">Friend Name</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-offline.gif" border="0" alt="" class="icon"/></a></li>
              <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend1.jpg" border="0" alt=""/></a></li>
              <li class="friend-picture-list-name"><a href="#">Balacz Barnucz</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-offline.gif" border="0" alt="" class="icon"/></a></li>
              <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend2.jpg" border="0" alt=""/></a></li>
              <li class="friend-picture-list-name"><a href="#">Friend Name</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-offline.gif" border="0" alt="" class="icon"/></a></li>
              <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend3.jpg" border="0" alt=""/></a></li>
              <li class="friend-picture-list-name"><a href="#">Friend Name</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-offline.gif" border="0" alt="" class="icon"/></a></li>
              <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend4.jpg" border="0" alt=""/></a></li>
              <li class="friend-picture-list-name"><a href="#">Friend Name</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-offline.gif" border="0" alt="" class="icon"/></a></li>
              <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend5.jpg" border="0" alt=""/></a></li>
              <li class="friend-picture-list-name"><a href="#">Friend Name</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-offline.gif" border="0" alt="" class="icon"/></a></li>
              <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend6.jpg" border="0" alt=""/></a></li>
              <li class="friend-picture-list-name"><a href="#">Friend Name</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-offline.gif" border="0" alt="" class="icon"/></a></li>
              <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend7.jpg" border="0" alt=""/></a></li>
              <li class="friend-picture-list-name"><a href="#">Friend Name</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-offline.gif" border="0" alt="" class="icon"/></a></li>
              <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend8.jpg" border="0" alt=""/></a></li>
              <li class="friend-picture-list-name"><a href="#">Friend Name</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-offline.gif" border="0" alt="" class="icon"/></a></li>
              <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend9.jpg" border="0" alt=""/></a></li>
              <li class="friend-picture-list-name"><a href="#">Friend Name</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-offline.gif" border="0" alt="" class="icon"/></a></li>
              <li class="friend-picture-list-image"><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend10.jpg" border="0" alt=""/></a></li>
              <li class="friend-picture-list-name"><a href="#">Friend Name</a><br/>Mojo : 140<br/><a href="#"><img src="images/icons/icon-offline.gif" border="0" alt="" class="icon"/></a></li>
            </ul>

          </div>

          <div id="friend-picture-grid" class="view">
            <ul class="friend-picture-grid">
              <ul>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend1.jpg" border="0" alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend2.jpg" border="0"  alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend3.jpg" border="0"  alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend4.jpg" border="0"  alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend5.jpg" border="0"  alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend6.jpg" border="0"  alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend7.jpg" border="0"  alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend8.jpg" border="0"  alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend9.jpg" border="0"  alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend10.jpg" border="0"  alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend1.jpg" border="0"  alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend2.jpg" border="0"  alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend3.jpg" border="0"  alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend4.jpg" border="0"  alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend5.jpg" border="0"  alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend6.jpg" border="0"  alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend7.jpg" border="0"  alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend8.jpg" border="0"  alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend9.jpg" border="0"  alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend10.jpg" border="0"  alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend1.jpg" border="0" alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend2.jpg" border="0" alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend3.jpg" border="0" alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend4.jpg" border="0" alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend5.jpg" border="0" alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend6.jpg" border="0" alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend7.jpg" border="0" alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend8.jpg" border="0" alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend9.jpg" border="0" alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend10.jpg" border="0" alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend1.jpg" border="0" alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend2.jpg" border="0" alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend3.jpg" border="0" alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend4.jpg" border="0" alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend5.jpg" border="0" alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend6.jpg" border="0" alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend7.jpg" border="0" alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend8.jpg" border="0" alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend9.jpg" border="0" alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend10.jpg" border="0" alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend5.jpg" border="0" alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend6.jpg" border="0" alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend7.jpg" border="0" alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend8.jpg" border="0" alt=""/></a></li>
                <li><a class="muj-image-friend" href="#" title="Friend Name"><img src="images/profile/friend9.jpg" border="0" alt=""/></a></li>
              </ul>
          </div>

        </div>

      </div>

      <!-- photographs tab-->
      <div id="photographs_tab" class="socialcontent">
 
      </div>

      <!-- video tab-->
      <div id="video_tab" class="socialcontent">

      </div>

      <!-- music tab-->
      <div id="music_tab" class="socialcontent">

      </div>

    </div>

  </body>
</html>

